<% layout('/layouts/default.html', {title: '预约管理', libs: ['validate','fileupload']}){ %>
<div class="main-content">
	<div class="box box-main">
		<div class="box-header">
			<div class="box-title">
				<i class="fa icon-trophy"></i> ${text(appointment.isNewRecord ? '新增预约' : '编辑预约')}
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<#form:form id="inputForm" model="${appointment}" action="${ctx}/fl/appointment/save" method="post" class="form-horizontal">
			<div class="box-body">
				<div class="form-unit">${text('基本信息')}</div>
				<#form:hidden path="id"/>
				<#form:hidden path="appointmentStatus"/>
				<% if (appointment.appointmentStatus == "1" || appointment.appointmentStatus == "2"){ %>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('预约人')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:select path="leaguer.id" items="${leaguerList}" itemLabel="name" itemValue="id" blankOption="true" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('地区')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:treeselect id="area_area" title="${text('区域选择')}" url="${ctx}/fl/appointment/treeData" 
									path="area.areaCode" labelPath="area.areaName" allowClear="true" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('诊所')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:select path="clinic.id" items="${clinicList}" itemLabel="name" itemValue="id" blankOption="true" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('科室')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:select path="department" dictType="fl_department" blankOption="true" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				<% } %>
				<% if (appointment.appointmentStatus != "5"){ %>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('预约日期')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:input path="scheduledTime" onchange="" readonly="true" maxlength="20" class="form-control Wdate"
									dataFormat="date" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true});"/>					
							</div>
						</div>
					</div>
					
				</div>
				
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('时间片')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<select id="timePeriod" name= "timePeriod" value="${appointment.timePeriod}" class="form-control required">
									<option value='${appointment.timePeriod}' selected>${appointment.timePeriod}</option>
								</select>
							</div>
						</div>
					</div>
					
				</div>
				<% } %>
				<% if (appointment.appointmentStatus == "3"){ %>
				<#form:hidden path="clinic.id"/>
				<#form:hidden path="department"/>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('医生')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:select path="doctor" items="${doctorList}" itemLabel="name" itemValue="id" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				
				<% } %>
				<% if (!appointment.isNewRecord && appointment.appointmentStatus != "3"){ %>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required ">*</span> ${text('理由')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:select path="reason" dictType="fl_reasons" blankOption="true" class="form-control required"/>
							</div>
						</div>
					</div>
					
				</div>
				<% } %>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-3" title="">
								<span class="required hide">*</span> ${text('备注信息')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-9">
								<#form:textarea path="remarks" rows="4" maxlength="500" class="form-control"/>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="box-footer">
				<div class="row">
					<div class="col-sm-offset-2 col-sm-9">
						<% if (hasPermi('fl:appointment:edit')){ %>
							<button type="button" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> ${text('保 存')}</button>&nbsp;
						<% } %>
						<button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="js.closeCurrentTabPage()"><i class="fa fa-reply-all"></i> ${text('关 闭')}</button>
					</div>
				</div>
			</div>
		</#form:form>
	</div>
</div>
<% } %>
<script>
<% if (appointment.appointmentStatus == "1" || appointment.appointmentStatus == "2"){ %>
var clinicList = ${toJson(clinicList)};
$("#area_areaCode").change(function () {
		var areaCode = $("#area_areaCode").val();
		$("#clinic_id").empty();
		$("#clinic_id").append("<option value=''>&nbsp;</option>");
		if (clinicList && clinicList.length > 0) {
          $.each(clinicList, function (idx, item) {
          	if(item.city.areaCode == areaCode){
              $("#clinic_id").append("<option value=" + item.id + ">" + item.name + "</option>");
            }
          });
      }
});
<% } %>
<% if (appointment.appointmentStatus == "2"){ %>
var areaCode = $("#area_areaCode").val();
if(areaCode != null && areaCode != ''){
		$("#clinic_id").empty();
		$("#clinic_id").append("<option value=''>&nbsp;</option>");
		if (clinicList && clinicList.length > 0) {
          $.each(clinicList, function (idx, item) {
          	if(item.city.areaCode == areaCode){
          		if(item.id == '${appointment.clinic.id}'){
              	$("#clinic_id").append("<option value='" + item.id + "' selected>" + item.name + "</option>");
            	}else{
            		 $("#clinic_id").append("<option value='" + item.id + "'>" + item.name + "</option>");
            	}
            }
          });
      }
}
<% } %>
<% if (appointment.appointmentStatus != "5"){ %>
		var clinic_id = $("#clinic_id").val();
		var department = $("#department").val();
		var scheduledTime = $("#scheduledTime").val();
		var id = $("#id").val();
		if(clinic_id != null && department != null && scheduledTime != null){
			$.post("${ctx}/fl/appointment/getTimePeriod", {clinicId: clinic_id,department:department,date:scheduledTime, id:id},function (reply) {
                $("#timePeriod").empty();
                if (reply && reply.length > 0) {
                    $.each(reply, function (idx, item) {
                        $("#timePeriod").append("<option value=" + item + ">" + item + "</option>");
                    });                              
                }
                $("#timePeriod").val('${appointment.timePeriod}');

         });
		}

$("#clinic_id,#department,#scheduledTime").change(function () {
		var clinic_id = $("#clinic_id").val();
		var department = $("#department").val();
		var scheduledTime = $("#scheduledTime").val();
		var id = $("#id").val();
		if(clinic_id != null && department != null && scheduledTime != null){
			$.post("${ctx}/fl/appointment/getTimePeriod", {clinicId: clinic_id,department:department,date:scheduledTime, id:id},function (reply) {

                $("#timePeriod").empty();
                if (reply && reply.length > 0) {
                    $.each(reply, function (idx, item) {
                        $("#timePeriod").append("<option value=" + item + ">" + item + "</option>");
                    });                              
                }

         });
		}

});
<% } %>
Date.prototype.format = function (fmt) { //author: meizz
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}

$("#btnSubmit").click(function () {
	var scheduledTime = $("#scheduledTime").val();
	var now = new Date().format("yyyy-MM-dd");
	if(now>=scheduledTime && ${appointment.appointmentStatus} == "1"){
			js.showMessage("预约日期必须从明天开始！！");
      return;
	}
	if(now>scheduledTime && ${appointment.appointmentStatus} == "2"){
			js.showMessage("预约日期不能早于今天！！");
      return;
	}
	$('#inputForm').submit();
});

$("#inputForm").validate({
	submitHandler: function(form){
		js.ajaxSubmitForm($(form), function(data){
			js.showMessage(data.message);
			if(data.result == Global.TRUE){
				js.closeCurrentTabPage(function(contentWindow){
					contentWindow.page();
				});
			}
		}, "json");
    }
});
</script>
